<div id="container">
    <div class="content">
        <form method="post" id="submit" name="submit">
            <div class="overview-left form-control">
                <h3>Thông tin tài khoản</h3>
                <div class="form-group">
                    <label class="label" for="username">Tài khoản</label>
                    <div class="col-reg">
                        <input class="input" id="username" name="username" placeholder="Tên tài khoản" type="text">
                        <span style="display: none" class="error-notice error-username">Tài khoản đã tồn tại</span>
                    </div>
                    <span style="display: none" class="accept accept-username"></span>
                </div>
                <div class="form-group">
                    <label class="label">Mật mã</label>
                    <div class="col-reg">
                        <input class="input" id="password" name="password" type="password">
                        <span style="display: none" class="error-notice error-password">Mật khẩu quá ngắn</span>
                    </div>
                    <span style="display: none" class="accept accept-password"></span>
                </div>
                <div class="form-group">
                    <label class="label">Email</label>
                    <div class="col-reg">
                        <input class="input" id="email" name="email" type="text">
                        <span style="display: none" class="error-notice error-email">Địa chỉ email đã tồn tại</span>
                    </div>
                    <span style="display: none" class="accept accept-email"></span>
                </div>

                <h3 style="margin-top: 20px">Thông tin chủ tài khoản</h3>
                <div class="form-group">
                    <label class="label">Nơi ở</label>
                    <div class="col-reg">
                        <select name="pid" class="select">
                            <?php
                                if(isset($province)){
                                    foreach($province as $value){
                                        echo '<option value="'.$value['pid'].'">'.$value['province'].'</option>';
                                    }
                                }
                            ?>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="label">Giới tính</label>
                    <div class="col-reg">
                        <div class="col-reg-child">
                            <input class="radio" name="sex" id="male" value="1" type="radio">
                            <label class="label-radio" for="male" >Nam</label>
                        </div>
                        <div class="col-reg-child">
                            <input class="radio" name="sex" id="female" value="0" type="radio">
                            <label class="label-radio" for="female">Nữ</label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="label">Ngày sinh</label>
                    <div class="col-reg">
                        <select name="day" class="select-25">
                            <option value="0" disabled selected>Ngày</option>
                            <?php
                            for($d = 1; $d <=31; $d++){
                                echo '<option value="'.$d.'">'.$d.'</option>';
                            }
                            ?>
                        </select>

                        <select name="month" class="select-25">
                            <option value="0" disabled selected>Tháng</option>
                            <?php
                                foreach($month as $k=>$v){
                                    echo '<option value="'.$k.'">'.$v.'</option>';
                                }
                            ?>
                        </select>

                        <select name="year" class="select-25">
                            <option value="0" disabled selected>Năm</option>
                            <?php
                                for($y = 1945; $y <=2014; $y++){
                                    echo '<option value="'.$y.'">'.$y.'</option>';
                                }
                            ?>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="label">Thu nhập</label>
                    <div class="col-reg">
                        <select name="salary" class="select">
                            <?php
                                if(isset($salary)){
                                    foreach($salary as $v){
                                        echo '<option value="'.$v['sid'].'">'.$v['salary'].'</option>';
                                    }
                                }
                            ?>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="label">Con</label>
                    <div class="col-reg">
                        <div class="col-reg-child">
                            <input class="radio" name="children" id="have_children" value="1" type="radio">
                            <label class="label-radio" for="have_children" >Có</label>
                        </div>
                        <div class="col-reg-child">
                            <input class="radio" name="children" id="no_children" value="0" type="radio">
                            <label class="label-radio" for="no_children">Không</label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="form-submit">
                        <input id="createAccount" class="btn" type="button" value="Tạo tài khoản">
                    </div>
                </div>
            </div>
            <div class="overview-right form-control">
                <h3>Nếu bạn có tài khoản Facebook</h3>
                <div class="form-group">
                    <a id="signUp_with_facebook" class="btn facebook-icon" href="" onclick="signUpFacebook(event, this);"><i style="padding-right: 5px; font-size: 16px" class="fa fa-facebook"></i> Đăng nhập bằng facebook</a>
                </div>
            </div>
        </form>
    </div>
</div>

<script>
    $(window).load(function(){
        $.ajax({
            type:"POST",
            url: Root_url+"register/signUpFacebookUrl",
            dataType:"json",
            data:{},
            success:(function(data){
                if(data.status == "ok"){
                    var url = data.url;
                    $('#signUp_with_facebook').attr('src', url);
                }
            })
        });
    });

    function signUpFacebook(e, obj){
        e.preventDefault();
        obj = $(obj);
        var url = obj.attr('src');
        var win = popupwindow(url, 'Facebook', 450, 250);
        var timer = setInterval(function() {
            if(win.closed) {
                clearInterval(timer);
                location.reload();
            }
        }, 1000);
    }

    function popupwindow(url, title, w, h) {
        var left = (screen.width/2)-(w/2);
        var top = (screen.height/2)-(h/2);
        return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
    }
</script>